import { onReady } from '@dcloudio/uni-app'
import { reactive, toRefs } from 'vue'

export default function useTemplateInfo(options) {
  const instance = options.value.instance
  const className = options.value.class

  const config = reactive({
    top: 0,
    bottom: 0,
    width: 375,
    screenHeight: 0,
  })

  onReady(() => {
    const query = uni.createSelectorQuery().in(instance.proxy)
    query
      .select(className)
      .boundingClientRect((data) => {
        console.log('data', data)
        config.width = data.width
        config.top = data.top
        config.bottom = data.bottom
      })
      .exec()
    config.screenHeight = uni.getSystemInfoSync().screenHeight
  })

  return {
    ...toRefs(config),
  }
}
